<!-- 消息信箱详情-->
<template>
	<view>
		<view class="msgDetail">
			<view class="msgTitle">
				<text>{{list.Title}}</text>
			</view>
			<view class="msgDate">
				<text>{{list.CreateDate}}</text>
			</view>
			<view class="msgContent">
				<text>{{list.Content}}</text>
			</view>
			<view style="display: flex;align-items: center; justify-content: center;">
				<div class="sub-button" @click="readOver">
					<text style="font-size:32upx;color:#FFFFFF">{{inter.know}}</text>
				</div>
			</view>
		</view>
		
	</view>
</template>

<script>
	import $api from '@/api/api.js'
	import $inter from '@/api/international.js'
	export default{
		data() {
			return {
				list:{},
				languageValue:'',
				newId:0
			}
		},
		onLoad(option){
			uni.getStorage({
				key:'languageValue',
				success:(res)=>{
					this.languageValue = res.data
				}
			})
			uni.setNavigationBarTitle({
				title: this.inter.messageDetail
			});
			let data = JSON.parse(option.data);
			this.newId=data.ID
			this.list=data
		},
		methods: {
			// 请求已读,并且返回
			readOver(){
				uni.showToast({
					title: 'loading',
					icon:'loading',
					mask:true,
				});
				
				$api.readOne({
					ID:this.newId
				},res=>{
					console.log(JSON.stringify(res))
					uni.setStorage({
						key:'readRefresh',
						data:2
					})
					uni.hideToast()
					uni.navigateBack()
				},err=>{
					uni.showModal({
						content: err.errMsg,
						showCancel: false
					});
					uni.hideToast()
				},e=>{
				})
			}
		},
		computed:{
			inter(){
				return $inter.message
			}
		}
		
		
		
	}
</script>

<style>
	.msgTitle{
		margin-top: 66upx;
		font-size: 32upx;
		color: #4A90E2;
		margin-bottom: 14upx;
	}
	.msgDate{
		color: #5D5D5D;
		font-size: 28upx;
		margin-bottom: 20upx;
	}
	.msgDetail{
		display: flex;
		flex-direction: column;
		align-items: center;;
		justify-content: flex-start;
	}
	.msgContent{
		margin: 0 auto;
		padding: 32upx 22upx;
		background-color: #FFFFFF;
		border-radius: 8upx;
		font-size: 28upx;
		line-height: 44upx;
		width: 93%;
	}
	.sub-button{
		display: flex;
		flex-direction: row;
		margin-top: 200upx;
		width:596upx;
		height:70upx;
		background: -webkit-linear-gradient(left, #107FD2 , #06C9ED); /* Safari 5.1 - 6.0 */
		background: -o-linear-gradient(right, #107FD2, #06C9ED); /* Opera 11.1 - 12.0 */
		background: -moz-linear-gradient(right, #107FD2, #06C9ED); /* Firefox 3.6 - 15 */
		background: linear-gradient(to right, #107FD2 , #06C9ED); /* 标准的语法 */
		border-radius:8upx;
		justify-content: center;
		align-items: center;
		
	}
</style>
